<template>
  <!-- <div v-loading="loadingRef" ref="chartRef" :style="{ height, width }"></div> -->
  <Line :loading="loadingRef" :chartData="chartData" />
</template>
<script lang="ts"
  setup>
  import { ref } from 'vue';
  import { getChartData } from '@/api/dataReport/deviceParamComparison';
  import Line from '@/components/Charts/Line/index.vue'

  import { cloneDeep } from 'lodash-es';

  let loadingRef = ref(true)
  const emptyData = {
    xaxisList: [],
    yaxisList: [],
  }

  const chartData = ref(cloneDeep(emptyData))

  const getData = (searchInfo) => {
    loadingRef.value = true;
    // 数据环比
    getChartData(searchInfo).then(res => {
      chartData.value = res
    }).catch(e => {
      chartData.value = cloneDeep(emptyData)
    }).finally(() => {
      loadingRef.value = false;
    })
  }

  defineExpose({
    getData
  })

</script>
